
//获取地址栏的id
let id = new URLSearchParams(location.search).get('id')
// console.log(id);




// 1. 初始化图片裁剪器
let $image = $('#image')

// 2. 裁剪选项
let options = {
    aspectRatio: 400/280,//宽高比 默认宽高的80%
    preview: '.img-preview',//指定预览区
    autoCropArea:1
}

// 3. 初始化裁剪区域
$image.cropper(options)

// ---------------------- 获取分类，渲染到下拉框的位置 ------------------
let form = layui.form;
// 1. 获取真实的分类，渲染到下拉框的位置
$.ajax({
    url: '/my/category/list',
    success: function (res) {
        // console.log(res)
        let arr = [];
        res.data.forEach(item => {
            arr.push(`<option value="${item.id}">${item.name}</option>`);
        })
        // $('#category').append(str);
        $('select[name=cate_id]').append(arr.join(''));
        // 更新渲染
        // form.render('select', 'lay-filter属性值');
        form.render('select');
        //----------获取一篇文章--------
        $.ajax({
            url: "/my/article/" + id,
            success: function (res) {
                if (res.status === 0) {
                    layer.msg(res.message)
                    form.val('edit', res.data)
                    //先回填  再把textarea 多行文本框换成 在线文本编辑器
                    initEditor()
                    //单独回填图片
                    $image.cropper('destroy').attr('src', abc + '/' + res.data.cover_img).cropper(options)
                }
            }
        })
    }
});



//单击按钮触发文件域
$('button:contains("选择封面")').on('click', function () {
    $('input[name=file]').trigger('click')
})

//当文件域内容改变后更换剪裁去的图片
$('#file').on('change', function () {
    //获取文件列表
    let files = this.files
    console.log('文件列表' + files);
    if (files.length > 0) {
        //把更换的图片的对象 转换成url
        let url = URL.createObjectURL(files[0])
        //更换剪裁区图片  销毁剪裁取-》更换图片-》新建剪裁取
        $image.cropper('destroy').attr('src', url).cropper(options)
    }
})
//表单提交
$('form').on('submit', function (e) {
    e.preventDefault()
    let fd = new FormData(this)
    fd.delete('file')
    fd.append('id',id)
    //修改
    fd.set('content', tinyMCE.activeEditor.getContent())
    //剪裁图片
    let canvas = $image.cropper('getCroppedCanvas', {width:400,higth:280})
    canvas.toBlob(blob => {
        // blob对象 二进制大对象 把他追加到formdata中 会自动转换成文件对象
        fd.append('cover_img', blob)
        //检查fd里的数据
        fd.forEach((value, key) => {
            console.log(key, value);
        })


        $.ajax({
            type: 'POST',
            url: '/my/article/update',
            data: fd,
            processData: false,
            contentType: false,
            success: function (res) {
                if (res.status === 0) {
                    layer.msg(res.message, { time: 1000 }, function () {
                        location.href = '../wz-List.html'
                    })
                } else {
                    layer.msg(res.message)
                }
            }
        })
    })
})